<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    .box {
        width: 80px;
        height: 240px;
        border: 1px solid transparent;
        background-color: black;
        border-radius: 10px;
    }

    .radius {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        margin-top: 15px;
        margin-left: 10px;
        background-color: #fff;
    }

    .red {
        background-color: red;
    }

    .yellow {
        background-color: yellow;
    }

    .green {
        background-color: green;
    }
</style>

<body>

    <div class="box">
        <div id="red" class="radius"></div>
        <div id="green" class="radius"></div>
        <div id="yellow" class="radius"></div>
    </div>
    <script>
        // console.log("00")

        //         function compare(a, b) {   //  笔试一
        //             let arr1 = a.split('.')
        //             let arr2 = b.split('.')
        //             const len = Math.min(arr1.length, arr2.length)
        //             for (let i = 0; i < len; i++) {
        //                 const num1 = parseInt(arr1[i])
        //                 const num2 = parseInt(arr2[i])
        //                 if (num1 > num2) {
        //                     return 1
        //                 } else if (num1 < num2) {
        //                     return -1
        //                 }
        //             }
        //             return 0
        //         }

        //         console.log(  compare('10.2.56.6001', '10.2.58.5001') ); // 返回-1
                // console.log(compare('10.2.56.6001', '10.2.54.5001')); // 返回 1
                // console.log(compare('10.2.56.5001', '10.2.56.5001')); // 返回 0

        // window.addEventListener('load', function () {  //  笔试二，使用 promise 写一个 动态的 红绿灯
            let timer1, timer2, timer3
            function a() {
                return new Promise((resolve, reject) => {
                    red.classList.add('red')
                    timer1 = setTimeout(() => {
                        resolve()
                    }, 3000)
                })
            }
            function b() {
                return new Promise((resolve, reject) => {
                    green.classList.add('green')
                    timer2 = setTimeout(() => {
                        resolve()
                    }, 2000)
                })
            }
            function c() {
                return new Promise((resolve, reject) => {
                    yellow.classList.add('yellow')
                    timer3 = setTimeout(() => {
                        resolve()
                    }, 1000)
                })
            }
            function d() {
                a().then(() => {
                    red.classList.remove('red')
                    clearTimeout(timer1)
                    return b()
                }).then(() => {
                    green.classList.remove('green')
                    clearTimeout(timer2)
                    return c()
                }).then(() => {
                    yellow.classList.remove('yellow')
                    clearTimeout(timer3)
                    return d()
                })
            }
            d()
        // })



        const url = "https://web.cbbs.tmall.com/index.html?name=alice&from=dchain&extraInfo=%7B%22a%22%3A%22b%22%2C%22c%22%3A%22d%22%7D#a754";
        function parseQueryString(str) {  //  笔试三 
            //编写你的代码
            str = str.split('#')[0];

            let urls = decodeURIComponent(str);  //  就是 解码 的

            console.log("urls:::", urls) // https://web.cbbs.tmall.com/index.html?name=alice&from=dchain&extraInfo={"a":"b","c":"d"}
            let params = urls.split('?');

            console.log("???:::", params)
            let param = params[1].split('&');

            console.log("&&&", param)
            let arr = [];
            for (let item in param) {
                let obj = param[item].split('=');
                console.log("obj::", obj)

                let object = {};
                object[obj[0]] = obj[1];

                console.log("object-----", object)

                console.log("****value", Object.values(object)[0].includes("{"))

                if (Object.values(object)[0].includes('{')) {
                    object[obj[0]] = JSON.parse(obj[1]);
                }

                arr.push(object)
            }
            return arr
        }

        const urlParams = parseQueryString(url);
        console.log(JSON.stringify(urlParams));
    </script>
</body>

</html>